<script>
import {createProps} from '@/utils';
import FieldRegistry from './FieldRegistry';

export default {
  name: 'FormField',
  props: {
    value: createProps(String),
    title: createProps(String),
    auth: createProps(String),
    comp: createProps(String),
    fieldConfig: createProps(Object),
  },
  render(h) {
    if (!this.comp || !FieldRegistry[this.comp]) return undefined;
    let comp = FieldRegistry[this.comp];
    return this.renderComp(comp, h);
  },
  methods: {
    renderComp(comp, h) {
      return h(comp, {
        props: {
          value: this.value,
          title: this.title,
          auth: this.auth,
          fieldConfig: this.fieldConfig,
        },
        on: {
          'update:value': (value) => {
            this.$emit('update:value', value);
          },
          'update:title': (value) => {
            this.$emit('update:title', value);
          }
        }
      });
    },
  }
};
</script>